<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<title>Mypetstore后台管理系统</title>
	<link rel="stylesheet" type="text/css" href="../assets/css/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="../assets/libs/icheck/skins/all.css">
	<link rel="stylesheet" type="text/css" href="../assets/css/iconfont.css">
	<link rel="stylesheet" type="text/css" href="../assets/css/style.css">
</head>

<body class="login-page">
	<div class="login-wrapper">
		<div class="header skew">
		</div>
		<div class="login-logo">
			<a href="../../index.html">
				<strong>MYPETSTORE</strong>
			</a>
		</div>
		<div class="login-body">
			<p class="text-primary text-center">欢迎使用宠物商店后台管理系统</p>
			<div class="form">
				<div class="form-group">
					<div class="input-group">
						<span class="input-group-addon">
							<i class="iconfont icon-login-user"></i>
						</span>
						<input type="text" id="username" class="form-control" placeholder="输入用户名">
					</div>
				</div>
				<div class="form-group">
					<div class="input-group">
						<span class="input-group-addon">
							<i class="iconfont icon-lock"></i>
						</span>
						<input type="password" id="password" class="form-control" placeholder="输入密码">
					</div>
				</div>
				<div class="form-group">
					<div class="input-group">
						<span class="input-group-addon">
							<i class="iconfont icon-power"></i>
						</span>
						<input type="text" id="phoneNumber" class="form-control" style="width: 60%;"
							placeholder="输入手机号验证">
						<input type="button" id="sendBtn" class="form-control" style="width: 40%;text-align: center;"
							value="获取验证码" />
					</div>
				</div>
				<div class="form-group">
					<div class="input-group">
						<span class="input-group-addon">
							<i class="iconfont icon-menu"></i>
						</span>
						<input type="text" id="code" class="form-control" style="width: 60%;" placeholder="输入短信验证码">
						<input type="button" id="verifyBtn" class="form-control" style="width: 40%;text-align: center;"
						   value="验证">
					</div>
				</div>
				<div class="form-group">
					<div class="row">
						<div class="col-xs-7">
							<span>
								<input type="checkbox" class="minimal">
								记住密码
							</span>
						</div>
						<div class="col-xs-5">
							<span class="pull-right">
								<a href="#">忘记密码?</a>
							</span>
						</div>
					</div>
				</div>
				<div class="form-group">
					<label>
						<button id="loginBtn" type="submit" class="btn btn-primary" style="position:relative;left: 134px;">登录</button>
					</label>
				</div>
				<div class="social-auth text-center">
					<p>第三方登录</p>
					<a href="#">
						<i class="iconfont icon-qq"></i>
					</a>
					<a href="#">
						<i class="iconfont icon-wechat"></i>
					</a>
					<a href="#">
						<i class="iconfont icon-sina"></i>
					</a>
				</div>
				<p class="text-center">
					<a href="register.html">没有账号?前往注册账号</a>
				</p>
			</div>
		</div>
	</div>

	<script type="text/javascript" src="../assets/js/jquery-2.1.0.min.js"></script>
	<script type="text/javascript" src="../assets/js/jquery-ui.min.js"></script>
	<script type="text/javascript" src="../assets/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="../assets/libs/icheck/icheck.min.js"></script>
	<script type="text/javascript" src="../assets/js/alpha.js"></script>
	<script type="text/javascript">
		$('input[type="checkbox"].minimal, input[type="radio"].minimal').iCheck({
			checkboxClass: 'icheckbox_minimal-blue',
			radioClass: 'iradio_minimal-blue'
		})
	</script>
	<script>
		$(function () {
			undefined
			$('#sendBtn').click(function () {
				undefined
				var number = $('#phoneNumber').val()
				$.ajax('http://localhost:8080/sms/send', {
					method: 'GET',
					data: {phoneNumber: number},
					success:function (result) {
						console.log(result);
					},
					error:function (err) {
						console.log(err);
					}
				})

				var count = 60;
				var countdown = setInterval(CountDown, 1000);
				function CountDown() {
					undefined
					$("#sendBtn").attr("disabled", true);
					$("#sendBtn").val("重新发送(" + count + ")");
					if (count == 0) {
						undefined
						$("#sendBtn").val("点我重新发送").removeAttr("disabled");
						clearInterval(countdown);
					}
					count--;
				}
			})
		});
	</script>
	<script>
		$(function () {
			undefined
			var check
			$('#verifyBtn').click(function () {
				undefined
				var number = $('#phoneNumber').val()
				var code = $('#code').val()

				$.ajax('http://localhost:8080/sms/verify', {
					method: 'GET',
					data: {phoneNumber: number, smsCode: code},
					success:function (result) {
						check = result
						alert(result)
					},
					error:function (err) {
						check = err
						alert(err)
					}
				})
			})

			console.log(check)
			$('#loginBtn').click(function () {
				undefined
				var username = $('#username').val()
				var password = $('#password').val()
				console.log(check)

				if (username === "admin" && password === "admin" && check === "验证成功") {
					$.get('http://localhost:8080/viewMain',{},function () {
						location.href="index.html";
					})
				}
			})
		});
	</script>
</body>

</html>